<template>
  <div class='groom first-box'>
    <Head :tabData="tabData" :selectIndex="selectIndex" :changeFun="changeSelect"></Head>
    <div>
      <component :is="componentName"></component>
    </div>
  </div>
</template>
<script>
import Head from '../../homepage/regiment/common/tab.vue'
import MyGroom from './common/mygroom.vue'
import MyReward from './common/myreward'
export default {
  components: {Head,MyGroom,MyReward},
  name: "",
  data() {
    return {
      tabData:[
        {
          label:"我要推荐"
        },{
          label:"我的推荐"
        },
      ],
      selectIndex:0,//默认项
      componentName:'MyGroom',//显示的组件
    };
  },
  methods: {
    changeSelect(index){
      this.selectIndex=index
      this.$set(this,"componentName",index==0?"MyGroom":"MyReward")
    },
  },
  created() {}
};
</script>
<style lang="scss" scoped>
.groom {
}
</style>